<template>
  <p-modal
    title="异常处置方案确认"
    :width="width"
    :visible="visible"
    :confirmLoading="confirmLoading"
    @ok="handleOk"
    :wrapClassName="'ycclfaqrModal'"
    @cancel="handleCancel"
  >
    <p-spin :spinning="confirmLoading">
      <p-form-model
        ref="ruleForm"
        :model="form"
        :rules="rules"
      >
      <info-list label-width="190">
        <info-list-item label="工序工单：">
          {{data.processNum || ''}}
        </info-list-item>
        <info-list-item label="异常类型：">
          {{data.exceptionType || ''}}
        </info-list-item>
        <info-list-item label="异常二级工序：">
          {{data.exceptionSecondProcess || ''}}
        </info-list-item>
        <info-list-item label="故障大类：">
          {{data.lineName || ''}}
        </info-list-item>
        <info-list-item label="故障小类：">
          {{data.exceptionWorkstation || ''}}
        </info-list-item>
        <info-list-item label="处置方案/临时措施：">
          {{data.exceptionCreateUser || ''}}
        </info-list-item>
      </info-list>
     <!--  <p-form-model-item label="工序工单" prop="gxgd">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.gxgd"
        />
      </p-form-model-item>
      <p-form-model-item label="异常类型" prop="yclx">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.yclx"
        />
      </p-form-model-item>
      <p-form-model-item label="异常二级工序" prop="ycerjgx">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.ycerjgx"
        />
      </p-form-model-item>
      <p-form-model-item label="故障大类" prop="gzdl">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.gzdl"
        />
      </p-form-model-item>
      <p-form-model-item label="故障小类" prop="gzxl">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.gzxl"
        />
      </p-form-model-item>
      <p-form-model-item label="处置方案/临时措施" prop="czfan">
        <p-input
          placeholder="请输入内容"
          disabled
          v-model="form.czfan"
        />
      </p-form-model-item> -->
      <p-form-model-item label="线长确认" prop="xzqr" style="margin-top: 10px;">
        <p-switch v-model="form.xzqr" checked-children="是" un-checked-children="否" default-checked />
      </p-form-model-item>
      <p-form-model-item label="验证不通过原因" prop="yzyybtg">
        <p-input
          placeholder="请输入内容"
          v-model="form.yzyybtg"
        />
      </p-form-model-item>
    </p-form-model>
    </p-spin>
  </p-modal>
</template>

<script>
import _ from "lodash";
import mesPeProcess from "@/api/mesPeProcess";
export default {
  name: "ycclfaqrModal",
  props: {
    data: Object,
    value: {
      type: Boolean,
      default: false
    },
  },
  data() {
    return {
      handle: '',
      width: 500,
      visible: false,
      confirmLoading: false,
      form: {
        gxgd: '', // 工序工单
        yclx: '', // 异常类型
        ycerjgx: '',
        gzdl: '', 
        gzxl: '',
        czfan: '',
        xzqr: '',
        yzyybtg: '',
      },
      rules: {
        gxgd: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        yclx: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        ycerjgx: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        gzdl: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        gzxl: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        czfan: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        xzqr: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ],
        /* yzyybtg: [
          { required: true, message: '请输内容', trigger: 'blur' },
        ], */
      },
    };
  },
  watch: {
    value() {
      this.initValue()
    },
    visible(val) {
      if (!val) {
        this.$emit('input', val)
      }
    }
  },
  created() {
  },
  mounted() {
    this.initValue();
  },
  methods: {
    /* validateQuantity(rule, value, callback){
      if (value === '' || value === null) {
        callback(new Error('请输入内容'));
      } else if (!(/^[1-9]\d*$/.test(value))) {
        callback(new Error("只能输入正整数"));
      } else {
        callback();
      } 
    }, */
    initValue() {
      this.visible = this.value
    },
    handleOk(){
      const that = this;
      that.$refs.ruleForm.validate(valid => {
        if (valid) {
        }
      });
    },
    handleCancel(){
      this.visible = false;
      this.$refs.ruleForm.resetFields();
    },
    /* getTemplatelist(){
      mesPeProcess.getTemplatelist({
        equno: this.form.resourceCode,
        standard: 'GZZYSX',
      }).then( res =>{
        if (res.code === 0){
          const curData = res.data || [];
          this.maintainContentCodeList = curData.map( el => {
            return {
              code: el.checkno,
              name: el.position,
            }
          });
        }
      })
    }, */
  },
};
</script>

<style lang="less">
  .ycclfaqrModal {
    .poros-form .poros-form-item{
      display: flex;
    }
    .poros-form{
      color: rgba(0, 0, 0, 0.85);
    }
    .poros-form-item-label{
      width: 130px;
    }
    .poros-form-item .poros-form-item-control-wrapper{
      overflow: hidden;
    }
    .gt-info-list-item{
      .label{
        text-align: right;
      }
    }
  }
</style>

